<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta content="telephone=no" name="format-detection" />
	<meta name="Description" content=""/>
	<meta name="Keywords" content=""/>
	<link href="favicon.ico" mce_href="favicon.ico" rel="bookmark" type="image/x-icon" />
	<link href="favicon.ico" mce_href="favicon.ico" rel="icon" type="image/x-icon" />
	<link href="favicon.ico" mce_href="favicon.ico" rel="shortcut icon" type="image/x-icon" />
	<title>盖网魔盒</title>
	<link rel="stylesheet" href="css/reset.css">
	<link rel="stylesheet" href="css/styles.css">
	<script src="js/jquery-2.2.2.min.js"></script>
	<script src="js/jquery.flexslider-min.js"></script>
	<script src="js/jquery.raty.js"></script>
	<script src="js/zepto.js"></script>
	<script src="js/dialog.js"></script>
	<script src="js/mobile-select-area.js"></script>
	<script src="js/common.js"></script>	
	<script src="json/shopsJson.js"></script>	
	<script>
		$.fn.raty.defaults.path = 'images/bg';
	    $(function () {
	    	if(window.name=="gwmhLogined"){
				$("#authentication").attr("href","hasLogined.html");
			}

	    	//评价星级
	        $(".star").raty({readOnly: true, score: 4.8});	 
			
			if($("#hd_area").val()){
				var index=$("#hd_area").val().toString().split('',1);
				$(".shops-container").find("ul:nth-child("+index+")").removeClass("hide").siblings().addClass("hide");
			}     
			
			//商家数据加载
			$(shopsData).each(function(){
				var cid = this.cid;
				var title = this.title;
				var href = this.href;
				var img = this.img;
				var info = this.info;
				var li = "<li><a href="+href+"><img src='"+img+"' alt='"+title+"'/><div class='des'><p class='shop-name'>"+title+"</p><p class='per-consumption'>"+info+"</p></div><div class='decoration'></div></a></li>";
				$(".shops-container").find("ul:nth-child("+cid+")").append(li);
			 });
	    })		
	</script>
</head>
<body>
	<header class="header">
		<a href="javascript:history.go(-1)" class="reback"></a>
	</header>
	<section class="container">
		<div class="banner plate-banner">
			<ul class="slides">
			    <li><a href="#" title="banner1"><img src="images/temp/banner/shopsBanner01.jpg" alt="banner1" /></a></li>
			    <li><a href="#" title="banner2"><img src="images/temp/banner/shopsBanner02.jpg" alt="banner2" /></a></li>
			    <li><a href="#" title="banner3"><img src="images/temp/banner/shopsBanner03.jpg" alt="banner3" /></a></li>
			</ul>
			<div class="decoration"></div>
		</div>
		<div class="gray-wrap">
			<div class="select-city clearfix">
				<input type="text" id="city" value="北京">
				<input type="hidden" id="hd_area"/>
			</div>
			<script>
				var cityJson =[{						
					"id":"1",
					"name":"北京"
				},/*{
					"id":"2",
					"name":"福州"
				},*/{
					"id":"3",
					"name":"南平"
				},{
					"id":"4",
					"name":"厦门"
				},{
					"id":"5",
					"name":"武夷山"
				}];
				var selectArea = new MobileSelectArea();
				selectArea.init({trigger:'#city',value:$('#city').data('value'),data:cityJson,eventName:'click',"callback":function(scroller,text,value){
					
				}});
			</script>	
			<div class="shops-container">
				<!--星级得分-->
				<!--<ul class="shop-list clearfix">
					<li>
						<a href="shopDetail.html" title="尊宝披萨">
							<img src="images/temp/shop_180x274.jpg" alt="尊宝披萨">
							<div class="des">
								<p class="shop-name">尊宝披萨</p>
								<p class="per-consumption">平均￥32/人</p>
								<p class="evaluation"><span class="star"></span>4.8分</p>
							</div>
							<div class="decoration"></div>
						</a>						
					</li>
				</ul>-->
				<ul class="shop-list clearfix"></ul>
				<ul class="shop-list clearfix hide"></ul>
				<ul class="shop-list clearfix hide"></ul>
				<ul class="shop-list clearfix hide"></ul>
				<ul class="shop-list clearfix hide"></ul>
			</div>			
		</div>			
	</section>
	<footer class="footer">
		<ul class="menu clearfix">
			<li>
				<a href="index.html">
					<i class="icon ico-01 active"></i>
					<span>主页</span>
				</a>
			</li>
			<li>
				<a href="login.html" id="authentication">
					<i class="icon ico-02"></i>
					<span>认证上网</span>
				</a>
			</li>
			<li>
				<a href="social.html">
					<i class="icon ico-03"></i>
					<span>局域社交</span>
				</a>
			</li>
		</ul>
	</footer>	
</body>
</html>